import React, { useEffect } from 'react'
import Charts from '../Charts/Charts'
import { View } from '@tarojs/components'
import { CircleProgress } from '@nutui/nutui-react-taro'

import './HealthInformation.scss'
import { growRealInfo } from '../../api/livestock'

export default function HealthInformation(props) {

    const { listInfoId, earInfo } = props

    // 当日体温
    const tW = async () => {
        const data = {
            orgid: '',
            livestockid: "08dc22fd-b6e1-49eb-8e20-ff756ed52e46"
        }
        const res = await growRealInfo(data)
        console.log(res);
    }

    useEffect(() => {
        tW()
    }, [])

    return (
        <View className='cattle-health'>
            {/* 牛信息 */}
            <View className='info'>
                <View className='avatar'>avatar</View>
                <View>牲畜编号</View>
            </View>
            {/* 活跃度 */}
            <View className='activity'>活跃度</View>
            <View className='activity-charts'>
                <View className='title'>活跃</View>
                <View className='img'></View>
            </View>
            {/* 健康指标 */}
            <View className='activity'>健康指标</View>
            <View className='index'>
                <CircleProgress percent={50} color='#0BCB75' radius={80}>
                    <div style={{ fontSize: '24rpx', color: '#666' }}>
                        今日运动量
                    </div>
                    <div style={{ fontSize: '48rpx', fontWeight: 'bold', color: '#666' }}>{earInfo.F_Step}</div>
                </CircleProgress>
                <CircleProgress percent={100} color='#0BCB75' radius={80}>
                    <div style={{ fontSize: '24rpx', color: '#666' }}>
                        当前体温
                    </div>
                    <div style={{ fontSize: '48rpx', fontWeight: 'bold', color: '#666' }}>{earInfo.F_Temper}℃</div>
                </CircleProgress>
            </View>
            {/* 运动量折线图 */}
            <View className='activity'>运动量</View>
            <View className='index'>

                <Charts></Charts>
            </View>
            <View className='activity'>体温</View>
            <View className='index'>

                <Charts></Charts>
            </View>

        </View>
    )
}
